<section>
  <div class="row">
    <div class="column small-12 large-6">
      <div class="sub-title has-number"><span class="text">Introducing Luigi</span></div>
      <div class="title-2">
        A better answer to distributed UI development - secure and infinitely scalable.
      </div>
    </div>
  </div>
  <div class="row">
    <div class="columns xlarge-9 content-wrapper" id="stickyAnchor" data-something>
      <p>Offering a wide array of products, many companies are also offering just as many entry points as user
        interfaces. Oftentimes, these entry points and user interfaces lack in consistency and recognizability. Seamless
        transition between products is often hard to achieve, and this is one of the cornerstones of a great customer
        experience. Ensuring a consistent look and feel and harmonizing all the products and applications is a demanding
        and expensive task. It means rebuilding them from the ground up and fulfilling particular UX requirements. One
        of the reasons why it is so difficult is that different products are developed on different technology stacks.
      </p>

      <p>We aspire to sell our customers a great customer experience and we believe that a great customer experience
        should be available to both customers and the people who make this customer experience possible – administrators
        and developers.</p>

      <p>With this goal in mind, we have designed Luigi, which makes it possible to transform your product smoothly from
        a monolith to a micro-service and micro-frontend architecture. With Luigi, you build an overarching
        administration and business user application and re-use the functions and views of the applications currently
        available. Also, you can take modules or even entire applications from third-party vendors and integrate them
        directly into your application.</p>

      <p>Luigi is your choice if you are using independent distributed UI teams to develop, deploy, maintain, and
        operate modules and end-to-end features independently. Such distributed teams do not have to make commitments to
        the same repository and depend on each other during the development and release cycles. This way, there is no
        need for any specific team to be the domain expert and fully own the entire underlying feature set and product
        portfolio behind the monolith UI. Another advantage is that, once developed, these independently developed
        features can be used by multiple solutions.</p>

      <p>Finally, Luigi provides out-of-the-box features such as a shell bar, a navigation component, and easy-to-use
        functions to display alerts, confirmation messages, etc.</p>
    </div>
    <div class="columns xlarge-3 right show-for-xlarge" data-sticky-container>
      <div class="sticky" data-sticky data-margin-top="6" data-anchor="stickyAnchor">
        <ul class="list-type-1 sticky-navigation">
          <li><a href="https://docs.luigi-project.io">Read Documentation</a></li>
          <li><a href="https://slack.luigi-project.io" target="_blank" rel="noopener noreferrer">Community</a></li>
          <li><a href="https://docs.luigi-project.io/docs/getting-started">How to get started</a></li>
          <li><a target="_blank" rel="noopener noreferrer"
              href="https://www.youtube.com/channel/UC5WsYsHapDlg2K3iXS4n4AQ">Our Youtube Channel</a></li>
        </ul>
      </div>
    </div>
  </div>
</section>

<section class="s-features has-big-padding">
  {{> features}}
</section>


<section class="s-adopters is-centered has-big-padding s-gradient">
  <div class="row align-center">
    <div class="column small-12 large-8 xlarge-6">
      <div class="sub-title has-number">
        <span class="text">Early adopters</span>
      </div>
      <h2 class="title-2 has-big-margin">From startups to the largest companies</h2>
    </div>
  </div>
  <div class="row">
    <div class="column small-12">
      {{> whoisusingluigi}}
    </div>
  </div>
</section>

<section class="s-get-ready s-gradient is-centered has-big-padding">
  <div class="row align-center">
    <div class="column small-12 large-6">
      <div class="title-2">
        Ready to create a great customer experience?
      </div>
      <a class="btn-primary" href="https://docs.luigi-project.io/docs/application-setup">GET STARTED</a>
    </div>
  </div>
</section>